<template>
  <!--  详情页面的弹窗-->
  <el-dialog :title="dialogTitle" style="width:600px;padding:40px;" v-model="dialogVisible" :before-close="handleClose">
    <el-text>文章内容</el-text>
<!--    <img :src="BASE_URL + ShowCompany.occupationPhoto" style="width:100%;height:100%;"/>-->
  </el-dialog>


  <!-- 公司信息表格 -->
  <el-card style="margin:20px;">
    <el-table :data="ForumArray">
      <el-table-column type="index" label="编号" width="80" align="center"/>
<!--      <el-table-column prop="forumArticleId" label="文章id" align="center"/>-->
<!--      <el-table-column prop="userId" label="用户id" align="center"/>-->
      <el-table-column prop="nickname" label="用户昵称" align="center"/>
      <el-table-column prop="articleDescription" label="文章描述" align="center"/>
      <el-table-column prop="articleContent" label="文章内容" align="center"/>
      <el-table-column prop="articleLike" label="点赞数" align="center"/>
      <el-table-column prop="articleCollect" label="收藏数" align="center"/>
<!--      <el-table-column prop="articleComment" label="评论数" align="center"/>-->
      <el-table-column prop="createTime" label="发布时间" align="center"/>
      <el-table-column prop="status" label="用户状态" align="center"/>
      <el-table-column label="操作" align="center">
        <template #default="scope">
          <el-button v-if="scope.row.status != '禁言'" link type="primary" size="small" @click="stopSay(scope.row.forumArticleId)" style="color:#5B63B7">禁言</el-button>
          <el-button v-else-if="scope.row.status == '禁言'" link type="primary" size="small" @click="Say(scope.row.forumArticleId)" style="color:#5B63B7">取消禁言</el-button>
        </template>
      </el-table-column>
    </el-table>
  </el-card>
</template>

<script setup>
import {onMounted, ref} from "vue";
import axios from "axios";
import {ElMessage} from "element-plus";
import qs from "qs";

const dialogTitle = ref('文章详情信息');
const dialogVisible = ref(false);
//实现取消按钮的功能
const handleClose = () => {
  if (confirm('是否关闭本窗口?')) {
    //用户确认关闭后,将审批弹窗与确认驳回弹窗一起关掉
    dialogVisible.value = false;

  }
}

onMounted(() => {
  loadForum();
})

//定义数组用来装用户列表信息
const ForumArr = ref([]);
const ForumArray = ref([]);
const ShowForum = ref({})

const loadForum = () => {
  axios.get(BASE_URL + '/v1/forum/select').then((response) => {
    if (response.data.code === 2000) {
      ForumArray.value = response.data.data;
    //   for (let i = 0; i < ForumArr.value.length; i++) {
    //     if (ForumArr.value[i].status == 0) {
    //       ForumArray.value.push(ForumArr.value[i]);
    //     }
    //   }
    }
  })
}

const stopSay = (id) => {
  //将id转为Long类型
  console.log(id);
  // if(confirm('您确认要禁言此用户吗?')){
    axios.post(BASE_URL+'/v1/forum/stopSay/'+id).then((response) => {
      if (response.data.code === 2000) {
        ElMessage.success('已禁言该用户!');
        loadForum();
      } else {
        ElMessage.error(response.data.msg);
      }
    })
  // }
}

const Say = (id) => {
  console.log(id);
    axios.post(BASE_URL+'/v1/forum/Say/'+id).then((response) => {
      if (response.data.code === 2000) {
        ElMessage.success('已取消该用户禁言!');
        loadForum();
      } else {
        ElMessage.error(response.data.msg);
      }
    })
}

// const moreInfo = (id) => {
//   dialogVisible.value = true;
//   axios.get(BASE_URL + '/v1/form/selectComment?id=' + id).then((response) => {
//     if (response.data.code === 2000) {
//       ShowForum.value = response.data.data;
//       console.log("文章评论" + ShowForum.value);
//     }
//   })
// }

</script>

<style scoped>

</style>